import { computed } from "vue";

const cacheMap = new WeakMap();
/**
 * 用于实现v-model效果的hook函数
 * @param props - 组件的props
 * @param propName - 需要实现v-model的prop名
 * @param emit - 触发更新事件的回调函数
 * @returns 返回一个computed对象
 */
export function useVModel(props: { [x: string]: any }, propName: string, emit: any) {
	return computed({
		/**
		 * 获取prop值
		 * @returns 返回prop的值
		 */
		get() {
			if (cacheMap.has(props[propName])) {
				return cacheMap.get(props[propName]);
			}
			const proxy = new Proxy(props[propName], {
				/**
				 * 获取proxy的属性值
				 * @param target - prop的值
				 * @param key - 属性名
				 * @returns 返回prop的属性值
				 */
				get(target, key) {
					return Reflect.get(target, key);
				},
				/**
				 * 设置proxy的属性值
				 * @param target - prop的值
				 * @param key - 属性名
				 * @param value - 属性值
				 * @returns 设置成功返回true
				 */
				set(target, key, value) {
					emit(`update:${propName}`, {
						...target,
						[key]: value,
					});
					return true;
				},
			});
			cacheMap.set(props[propName], proxy);
			return proxy;
		},
		/**
		 * 设置prop的值
		 * @param val - 需要设置的值
		 */
		set(val) {
			emit(`update:${propName}`, val);
		},
	});
}
